<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>用户注册</title>
  <link href="css/style.css" rel="stylesheet" type="text/css" />
  <script type="text/javascript" src="js/jquery.js"></script>
</head>

<body>


<div class="formbody">

  <div class="formtitle"><span>用户注册</span></div>

  <form action="register" method="post">
    <ul class="forminfo">
      <li><label>用 户 名:</label><input name="zh" id="zh" type="text" class="dfinput" onblur="checkAccount()"/><i id="msg"></i></li>
      <li><label>用户密码:</label><input name="mm" id="mm" type="password" class="dfinput" /><i>密码不能少于6位</i></li>
      <li><label>确认密码:</label><input name="remm" type="password" class="dfinput" /><i>密码不能少于6位</i></li>
      <li><label>真实姓名:</label><input name="name" type="text" class="dfinput" /><i>真实姓名不能少于2位</i></li>
      <li><label>&nbsp;</label><input name="" type="submit" class="btn" value="提交信息"/></li>
    </ul>
  </form>

</div>
</body>
</html>
<script>
  function checkAccount() {
    //1.先获取输入的账号
    var zh=$("#zh").val();
    //2.去后端数据库查询该账号是否存在
    $.get("checkUserAccount?zh="+zh,function (data){
      if(data=="no"){
        $("#msg").text("该账号已经被占用！");
        $("#zh").focus();
      }else{
        $("#msg").text("");
        $("#mm").focus();
      }
    })
  }
</script>